<!--
 * @Description: 
 * @Author: qingyang
 * @Date: 2022-01-19 13:28:51
 * @LastEditors: chenju
 * @LastEditTime: 2022-01-19 14:01:37
-->
<template>
  <i class="g-icon">
    <svg class="icon svgfont" aria-hidden="true">
      <use :xlink:href="xlinkHref"></use>
    </svg>
  </i>
</template>
<script lang="ts">
export default {
  name: 'GIcon'
};
</script>
<script lang="ts" setup>
import { defineProps, computed } from 'vue';
const props = defineProps({
  type: {
    type: String,
    required: true
  }
});
const xlinkHref = computed(() => {
  return `#${props.type}`;
});
</script>

<style scoped lang="scss">
.g-icon {
  font-size: 16px;
  .icon {
    width: 1em;
    height: 1em;
    vertical-align: -0.15em;
    fill: currentColor;
    overflow: hidden;
  }
}
</style>
